import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hippo_app/router_table.dart';
import 'package:hippo_app/values/color_value.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

class AppPage extends StatefulWidget {
  const AppPage({super.key});

  @override
  State<AppPage> createState() => _AppPageState();
}

class _AppPageState extends State<AppPage> {
  int currentIndex = 0;
  List<Widget> tabBarPages = [
    RouterTable.homePage,
    RouterTable.plantCategoryPage,
    RouterTable.settingPage,
  ];

  Widget buildAppNavBar(BuildContext context) {
    return PopScope(
      canPop: false,
      onPopInvokedWithResult: (didPop, result) {},
      child: Scaffold(
        body: tabBarPages[currentIndex],
        bottomNavigationBar: Container(
          decoration: BoxDecoration(
            border: Border(
              top: BorderSide(color: ColorValue.appBorderColor, width: 0.15),
            ),
          ),
          child: BottomNavigationBar(
            onTap: (index) {
              setState(() {
                currentIndex = index;
              });
            },
            selectedFontSize: 10.0,
            unselectedFontSize: 10.0,
            backgroundColor: Colors.white,
            type: BottomNavigationBarType.fixed,
            fixedColor: ColorValue.appPrimaryColor,
            currentIndex: currentIndex,
            items: [
              BottomNavigationBarItem(
                icon: SvgPicture.asset(
                  "assets/images/app/navbar_home.svg",
                  width: 30,
                  height: 30,
                ),
                activeIcon: SvgPicture.asset(
                  "assets/images/app/navbar_home_selected.svg",
                  width: 30,
                  height: 30,
                ),
                label: AppLocalizations.of(context)!.homePageTitle,
              ),

              BottomNavigationBarItem(
                icon: SvgPicture.asset(
                  "assets/images/app/navbar_category.svg",
                  width: 30,
                  height: 30,
                ),
                activeIcon: SvgPicture.asset(
                  "assets/images/app/navbar_category_selected.svg",
                  width: 30,
                  height: 30,
                ),
                label: AppLocalizations.of(context)!.plantCategoryPageTitle,
              ),
              BottomNavigationBarItem(
                icon: SvgPicture.asset(
                  "assets/images/app/navbar_setting.svg",
                  width: 30,
                  height: 30,
                ),
                activeIcon: SvgPicture.asset(
                  "assets/images/app/navbar_setting_selected.svg",
                  width: 30,
                  height: 30,
                ),
                label: AppLocalizations.of(context)!.settingPageTitle,
              ),
            ],
          ),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return buildAppNavBar(context);
  }
}
